html {
    height: 100%;
}

body {
    height: 100%;
    display: flex;
    flex-direction: column;
}

#header {
    width: 100%;
    height: 1.2rem;
    background: #ff841d;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#header h1 {
    color: #fff;
    font-size: .426667rem
}

#header a img {
    width: .613333rem;
}

#body {
    flex: 1;
}

#body ul li {
    font-size: .426667rem;
    width: 48%;
    height: 8.216216216rem;
    border: .053333rem solid #f7f7f7;
    font-size: .426667rem;
    float: left;
}

#body ul li a {
    display: block;
    padding: .266667rem .213333rem;
    color: red;
}

#body ul li a img {
    display: inline-block;
    width: 3.733333rem;
    height: 3.733333rem;
    padding: .8rem 0 0 .4rem;
}

#body ul li a h5 {
    color: #49495d;
    margin: .133333rem 0;
}

#body ul li a p {
    color: #ff9543;
    margin: 0 0 .266667rem;
}

#body ul li a span {
    display: block;
    color: #9d9d9d;
}

#footer {
    height: 1.946667rem;
    background: #efefef;
    text-align: center;
    display: flex;
    flex-direction: column;
}

#footer a,
#footer span {
    display: inline-block;
}

#footer ul {
    display: flex;
    /* justify-content: space-around; */
}

#footer ul li {
    flex: 1;
    border: .026667rem solid #d1d1d1;
}

#footer ul li a {
    font: .266667rem/.586667rem "";
    color: #4d4d4d;
    /* padding:0 1.284rem; */
}

.footer-bottom {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#footer .footer-bottom a {
    font-size: .266667rem;
    color: #fc2323;
}

#footer .footer-bottom span:nth-of-type(1) {
    font-size: .266667rem;
    color: #2f2f2f;
}

#footer .footer-bottom span:nth-of-type(2) {
    font-size: .266667rem;
    color: #6f6f6f;
}
